<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>  
<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta http-equiv="Content-Language" content="zh-CN">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="shop">
    <meta name="author" content="letsun">
    <title>新增配送地址</title>
    <%@ include file ="../init.jsp" %>
    <script src="${resources}/js/cityData.js"></script>
    <style>
        #nav {
            background-color: #de2525;
        }

        #nav .logo .fore1 {
            background: url(${resources}/images/1_1.png) center no-repeat;
            width: 320px;
            background-size: 85%;
        }
    </style>
</head>

<body>
<%@ include file = "../header_1.jsp" %>

<div class="container">
    <div class="row">
        <div class="col-md-1">
        	<%@ include file ="../menu.jsp" %>
        </div>
        <div class="col-md-11">

            <!-- page-header -->
            <div class="page-header">
                <div class="page-comm">
                    <div class="mt">
                        <h3>新增收货地址</h3>
                    </div>
                    <div class="mc">
                        <p>设置好轻松购信息，就可以在商品页面直接下单 ，购物从此变得简单快乐。</p>
                    </div>
                </div>
            </div>
            <!--/.page-header -->

            <!-- page-content -->
            <div class="page-content">
                <div class="page-comm">

                    <!-- 表单开始 form begin -->
                    <form class="form-horizontal" id="validation-form" method="post" action="">
                        <input type="hidden" name="address" id="address" value="${address.address }">
                        <input type="hidden" name="id" id="addressid" value="${address.id}">
                        <input type="hidden" name="status" id="status" value="${address.status }">
                        <input type="hidden" name="member.id" value="${address.member.id}">
                        <input type="hidden" name="createTime" value="${address.createTime}">
                        <input type="hidden" name="corp.id" value="${address.corp.id}">
                        <div class="form-group">
                            <label for="receiverName" class="col-md-2 control-label"><em>*</em>收货人：</label>
                            <div class="col-md-4">
                                <input style="border: 1px solid #ccc;" type="text" class="form-control" id="name" name="name" value="${address.name}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="mobile" class="col-md-2 control-label"><em>*</em>联系电话：</label>
                            <div class="col-md-4">
                                <input style="border: 1px solid #ccc;" type="text" class="form-control" id="telephone" name="telephone" value="${address.telephone}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="province" class="col-md-2 control-label"><em>*</em>所在地区：</label>
                            <div class="col-md-4">
                                <select id="province" name="province" class="form-control">
                                </select>
                                <br>
                                <select id="city" name="city" class="form-control">

                                </select>
                                <br>
                                <select id="area" name="area" class="form-control" style="display: none">

                                </select>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="street" class="col-md-2 control-label"><em>*</em>所在街道：</label>
                            <div class="col-md-4">
                                <textarea class="form-control" id="street" name="street" rows="3" maxlength="100">${address.street }</textarea>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="inputEmail3" class="col-md-2 control-label"><em>*</em>默认地址：</label>
                            <div class="col-md-4">
                                <label class="radio-inline">
                                    <input type="radio" name="isDefault" <c:if test="${address.isDefault==1 || address.isDefault==null }">checked="checked"</c:if>  value="1"> 是
                                </label>
                                <label class="radio-inline">
                                    <input type="radio" name="isDefault" <c:if test="${address.isDefault==0 }">checked="checked"</c:if>  value="0"> 否
                                </label>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-md-2 control-label"></label>
                            <div class="col-md-4">
                                <a class="btn btn-danger" href="javascript:void(0);" onclick="submitFunc()">提交</a>
                            </div>
                        </div>
                        <input type="hidden" id="selectflag" value="0">
                    </form>
                </div>
            </div>
            <!--/.page-contet -->
        </div>
    </div>
</div>

<%@ include file ="../footer.jsp" %>

<script type="text/javascript">
</script>

<script>


$(function () {
    function initProvince(p, c, a) {
        var province = "";
        var city = "";
        var cityList;
        var type;
        var areaList;
        var area = "";

        if (!p) {
            p = "北京";
        }

        for (var i = 0; i < cityData.length; i++) {
            if (cityData[i].name == p) {
                province += '<option value="' + cityData[i].name + '" data-type="' + cityData[i].type + '" selected>' + cityData[i].name + '</option>';
                type = cityData[i].type;
                cityList = cityData[i].sub;
            } else {
                province += '<option value="' + cityData[i].name + '" data-type="' + cityData[i].type + '">' + cityData[i].name + '</option>';
            }
        }

        for (var j = 0; j < cityList.length; j++) {
            if (cityList[j].name == "请选择") {
                city += '<option value="">' + cityList[j].name + '</option>';
            } else if (cityList[j].name == c) {
                city += '<option value="' + cityList[j].name + '" selected>' + cityList[j].name + '</option>';
                areaList = cityList[j].sub;
            } else {
                city += '<option value="' + cityList[j].name + '">' + cityList[j].name + '</option>';
            }
        }

        if (a) {
            for (var k = 0; k < areaList.length; k++) {
                if (areaList[k].name == "请选择") {
                    area += '<option value="">' + areaList[k].name + '</option>';
                } else if (areaList[k].name == a) {
                    area += '<option value="' + areaList[k].name + '" selected>' + areaList[k].name + '</option>';
                } else {
                    area += '<option value="' + areaList[k].name + '">' + areaList[k].name + '</option>';
                }
            }

            $("#area").show().html(area);
        }

        $("#province").html(province);
        $("#city").html(city).data("type", type).data("province", p);
    }

    function placeEvent() {
        /**
         * 选择省份
         */
        $("#province").on("change", function () {
            var type = $("#province").find("option:selected").data("type");
            var province = $(this).val();
            var cityList;
            var city = "";

            for (var i = 0; i < cityData.length; i++) {
                if (cityData[i].name == province) {
                    cityList = cityData[i].sub;
                }
            }

            for (var j = 0; j < cityList.length; j++) {
                if (cityList[j].name == "请选择") {
                    city += '<option value="">' + cityList[j].name + '</option>';
                } else {
                    city += '<option value="' + cityList[j].name + '">' + cityList[j].name + '</option>';
                }
            }

            $("#city").html(city).data("type", type).data("province", province);
            $("#area").hide();
            $("#selectflag").val(0);
        });

        /**
         * 选择城市
         */
        $("#city").on("change", function () {
            var type = $(this).data("type");
            var city = $(this).val();
            var province = $(this).data("province");
            var cityList;
            var areaList;
            var area = "";

            if (type == 0 || city == "") {
                $("#area").hide();
                $("#selectflag").val(0);
                return;
            }

            for (var i = 0; i < cityData.length; i++) {
                if (cityData[i].name == province) {
                    cityList = cityData[i].sub;
                }
            }

            for (var j = 0; j < cityList.length; j++) {
                if (cityList[j].name == city) {
                    areaList = cityList[j].sub;
                }
            }

            for (var k = 0; k < areaList.length; k++) {
                if (areaList[k].name == "请选择") {
                    area += '<option value="">' + areaList[k].name + '</option>';
                } else {
                    area += '<option value="' + areaList[k].name + '">' + areaList[k].name + '</option>';
                }
            }

            $("#area").show().html(area);
            $("#selectflag").val(1);
        });
    }
	var updateAddress = "${address.address}";
	if(updateAddress!=""||updateAddress!=null){
	 	var addressarr = updateAddress.split(" ");
   		initProvince(addressarr[0],addressarr[1],addressarr[2]);
	}else{
   		initProvince();
	}
    placeEvent();

});
     function submitFunc() {
    	var name = $("#name").val();
        var street = $("#street").val();
        street = $.trim(street);
        
        if(name==""||name==null){
        	  alertSuccess("请填写收货人姓名");
              return false;
        }
        var mobile = /^(1[0-9])\d{9}$/;
        if (!mobile.test($("#telephone").val())) {
            alertSuccess("请输入正确的手机号");
            return false;
        }
        var selectflag = $("#selectflag").val();
        var province = $("#province").val();
        var city = $("#city").val();
        var area = $("#area").val();
        var address = "";
        if(selectflag==1){
	        if (province == "" || city == "" || area =="") {
	            alertSuccess("请完善您的收货地址");
	            return false;
	        }
        }else{
        	 if (province == "" || city == "") {
 	            alertSuccess("请完善您的收货地址");
 	            return false;
 	        }
        }
        if (selectflag==1) {
            address += province +" "+ city +" "+ area;
        } else {
            address += province +" "+ city;
        }
        $("#address").val(address);
        var street =$("#street").val();
        if (street == "") {
	            alertSuccess("请完善您的收货地址");
	            return false;
        }
        var isDefault = $("input[name='isDefault']:checked").val();
        var todo ='${todo}';
        var addresspath = '';
        if(parseInt(todo)==0){
        	addresspath = '${path}/manage/myCenter/saveaddress/0';
        }else{
        	addresspath = '${path}/manage/myCenter/saveaddress/1';
        }
        $("#validation-form").attr('action',addresspath); 
        var flag = false;
        if (isDefault == 1) {
            flag = confirm("是否将此地址设置成为默认地址 ?");
            if (flag) {
                $("#validation-form").submit();
            }
        } else {
            $("#validation-form").submit();
        }
    } 
</script>
</body>
</html>